<template xmlns:v-bind="http://www.w3.org/1999/xhtml" xmlns:v-on="http://www.w3.org/1999/xhtml">
  <div>
    <group>
      <cell-box v-for="(item, index) in info.baseinfo" :key="index" v-if="item.type !== 'btn'">
        <label>{{ item.label }}</label>
        <span class="content">{{ item.value }}</span>
      </cell-box>
      <x-button v-else class="from_submit" type="primary" action-type="button" @click.native="declare">{{ item.label
        }}
      </x-button>
      <x-button class="from_submit" type="primary" action-type="button" @click.native="openHelp">在线咨询</x-button>
    </group>
    <div class="weui-panel" v-for="(item, index) in info.otherinfo" :key="index">
      <div class="weui-panel__hd">{{ item.head }}</div>
      <div class="weui_panel__bd">
        <div class="weui-media-box weui-media-box_text">
          <p class="weui-media-box__desc" v-for="i in item.items" v-if="i.type === 'img'">
            <img v-bind:src="i.value">
          </p>
          <p class="weui-media-box__desc" v-for="i in item.items" v-if="i.type === 'file'">
            <a v-bind:href="i.value">{{ i.label }}</a>
          </p>
          <p class="weui-media-box__desc" v-for="i in item.items" v-if="i.type === 'text'">{{ i.value }}</p>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
  import Group from 'vux/src/components/group/index'
  import CellBox from 'vux/src/components/cell-box/index'
  import Panel from 'vux/src/components/panel/index'
  import Radio from 'vux/src/components/radio/index'
  import XButton from 'vux/src/components/x-button/index'

  export default {
    components: {
      Group,
      CellBox,
      Panel,
      Radio,
      XButton
    },
    methods: {
      getInfo () {
        this.$vux.loading.show({
          text: 'Loading'
        })
        let url = 'https://ydt.xy12345.cn/edot/work/guide/selectGuideInfo1'
        let param = {
          workCode: this.$route.params.id
        }
        this.$axios.post(url, this.$qs.stringify(param)).then(response => {
          this.info = response.data.data
          this.$vux.loading.hide()
        })
      },
      declare () {
        // 路由跳转，传递参数
        this.$router.push({
          name: 'declare',
          params: { id: this.$route.params.id }
        })
      },
      openHelp () {
        // 路由跳转，传递多个参数
        this.$router.push({
          name: 'workHelp',
          params: {
            workCode: this.$route.params.id,
            deptName: this.info.baseinfo[1].value
          }
        })
      }
    },
    mounted () {
      this.$store.commit('updataTitleStatus', '办事指南')
      this.getInfo()
    },
    data () {
      return {
        info: '',
        workCode: this.$route.params.id
      }
    }
  }
</script>

<style scoped lang="less">
  @import '~vux/src/styles/weui/widget/weui_panel/weui_panel.less';
  @import '~vux/src/styles/weui/widget/weui_media_box/weui_media_box.less';

  label {
    min-width: 25vw;
    font-weight: 700;
  }

  .weui-panel__hd {
    background-color: #eeeeee;
    font-size: 16px;
  }

  .weui-panel:after, weui-panel:before{
    border: none;
  }

  img {
    box-sizing: border-box;
    max-width: 100%;
    height: auto;
    vertical-align: middle;
    border: 0;
  }

  .from_submit {
    width: 90vw;
    margin: 5vw auto;
  }
</style>
